import React from 'react'
import ReactDOM from 'react-dom'    
import  ListDeal from '../../component/ListDeal/ListDeal'//ListDeal
import Btn from '../../component/Button/Button'
import Spinner  from '../../component/Spinner/Spinner';  //提示
import * as DataHandler from './DataHandler'
import './css/ApplicationForm.css' 

class ApplicationForm extends React.Component {
    constructor(props) {
        super(props);
        this.state = { 
            legend : false , 
            loading:false,
            
        };
    }
    config =  [
        {
            title:'请假申请单',
            data:[
                     {
                        icon:'./assets/time.png', 
                        name:'时间期限:',
                        itemStyle:{width:'80px'},    
                        type:'time',  
                        rule:{//上班时间
                             dlz:{//冬令制
                                    st:[10,1],//开始时间10月1号
                                    et:[5,31],//结束是5月31 3.5+3.5==7
                                    tm:['08:30-12:00',"14:30-18:00"]
                                },
                            xlz:{//夏令制
                                    st:[6,1],//开始时间6月1号
                                    et:[9,31],//结束是9月31   3.5+3=6.5
                                    tm:['08:30-12:00',"15:00-18:00"] 
                                },  
                        },
                        tms:0,//请假时长，保存取这个
                },
                {
                        icon:'./assets/type.png', 
                        name:'请假类型:',
                        itemStyle:{width:'80px'}, 
                        type:'btn',
                        currentLev:'事假',//保存取这个
                        currentIndex:'0',
                        btnClick:(data,index)=>{
                            data.data.map((item,i)=>{
                                if(i==index){
                                    item.class='normal active';
                                   data.currentLev =item.text;
                                   data.currentIndex = item.value;
                                }else{
                                    item.class ='normal'
                                }
                            }) 
                            this.setState({}) 
                        },
                        data:[
                        //     {
                        //     text:'事假', 
                        // },{
                        //     text:'病假', 
                        // },{
                        //     text:'婚假', 
                        // },{
                        //     text:'丧假', 
                        // }
                        ]
                    },
                    {
                        icon:'./assets/chat.png', 
                        name:'事由:',
                        itemStyle:{width:'80px'}, 
                        type:'input',
                        placeholder:'请填写事由',
                        rightStyle:{width:'100%',border:'0',textAlign:'right',padding:'10px'},
                        content:'',
                        inputChange:(e,data)=>{ 
                            data.content = e.target.value; 
                            this.setState({})
                        }
                    }
                ]
        },
        {
            title:'漏打卡申请单',
            data:[
                {
                        icon:'./assets/time.png', 
                        name:'时间期限:',
                        itemStyle:{width:'95px'}, 
                        type:'signleTime',  
                        tms:0,//请假时长，保存取这个                        
                },
                {
                        icon:'./assets/type.png', 
                        name:'漏打卡类型:',
                        itemStyle:{width:'115px'}, 
                        type:'btn',
                        currentLev:'下午',//保存取这个      
                        currentIndex:'0',
                        btnClick:(data,index)=>{
                            data.data.map((item,i)=>{
                                if(i==index){
                                    item.class='normal active';
                                   data.currentLev =item.text;
                                   data.currentIndex = item.value
                                }else{
                                    item.class ='normal'
                                }
                            }) 
                            this.setState({}) 
                        },
                        data:[
                        //     {
                        //     text:'上午', 
                        // },{
                        //     text:'下午', 
                        // },{
                        //     text:'全天', 
                        // }
                        ]
                },
                {
                        icon:'./assets/chat.png', 
                        name:'漏打卡说明:',
                        itemStyle:{width:'115px'}, 
                        type:'input',
                        placeholder:'请输入',
                        rightStyle:{width:'100%',border:'0',textAlign:'right',padding:'10px'},
                        content:'',//保存取这个
                        inputChange:(e,data)=>{ 
                            data.content = e.target.value; 
                            this.setState({})
                        }
                },
                {
                    icon:'./assets/pic.png', 
                    name:'图片:',
                    nameStyle:{}, 
                    data:[ ],//图片信息 
                    type:'file',   
                } 
              ]
        },
        {
            title:'外出申请单',
            data:[
                   {
                        icon:'./assets/time.png', 
                        name:'时间期限:',
                        itemStyle:{width:'80px'}, 
                        type:'time',  
                    },
                     {
                        icon:'./assets/place.png', 
                        name:'外出地点:',
                        itemStyle:{width:'80px'}, 
                        type:'input',
                        placeholder:'请输入',
                        rightStyle:{width:'100%',border:'0',textAlign:'right',padding:'10px'},
                        content:'',
                        inputChange:(e,data)=>{ 
                            data.content = e.target.value; 
                            this.setState({})
                        }
                    },
                    {
                        icon:'./assets/type.png', 
                        name:'外出类型:',
                        itemStyle:{width:'80px'}, 
                        type:'btn',
                        currentLev:'工作',
                        currentIndex:0,
                        btnClick:(data,index)=>{
                            data.data.map((item,i)=>{
                                if(i==index){
                                    item.class='normal active';
                                   data.currentLev = item.text;
                                   data.currentIndex = item.value
                                }else{
                                    item.class ='normal'
                                }
                            }) 
                            this.setState({}) 
                        },
                        data:[
                        //     {
                        //     text:'工作', 
                        // },{
                        //     text:'会议', 
                        // },{
                        //     text:'巡堤', 
                        // },{
                        //     text:'培训', 
                        // }
                        ]
                    },
                    {
                        icon:'./assets/theme.png', 
                        name:'主题:',
                        itemStyle:{width:'80px'}, 
                        type:'input',
                        placeholder:'请输入',
                        rightStyle:{width:'100%',border:'0',textAlign:'right',padding:'10px'},
                        content:'',
                        inputChange:(e,data)=>{ 
                            data.content = e.target.value; 
                            this.setState({})
                        }
                    },
                    {
                        icon:'./assets/org.png', 
                        name:'组织方:',
                        itemStyle:{width:'80px'}, 
                        type:'input',
                        placeholder:'请输入',
                        rightStyle:{width:'100%',border:'0',textAlign:'right',padding:'10px'},
                        content:'',
                        inputChange:(e,data)=>{ 
                            data.content = e.target.value; 
                            this.setState({})
                        }
                    },
                      {
                        icon:'./assets/teacher.png', 
                        name:'讲师:',
                        itemStyle:{width:'80px'}, 
                        type:'input',
                        placeholder:'请输入',
                        rightStyle:{width:'100%',border:'0',textAlign:'right',padding:'10px'},
                        content:'',
                        inputChange:(e,data)=>{ 
                            data.content = e.target.value; 
                            this.setState({})
                        }
                    }, 
                  {
                    icon:'./assets/files.png', 
                    name:'附件:',
                    nameStyle:{}, 
                    type:'file',  
                    data:[ ],//图片信息 
                },
                {
                    icon:'./assets/chat.png', 
                    name:'外出事宜:',
                    itemStyle:{width:'80px'}, 
                    type:'input',
                    placeholder:'请输入',
                    rightStyle:{width:'100%',border:'0',textAlign:'right',padding:'10px'},
                    content:'',
                    inputChange:(e,data)=>{ 
                        data.content = e.target.value; 
                        this.setState({})
                    }
                },
             
              ]
        }
    ]

     info={
        boxW:360,
        type:'missed',//申请单类别，有leave、missed、goOut
        listConfig:{},
        fileId:[],
        searchWord:{}, 
    }  
     componentWillMount = () => {
            this.info.searchWord = this.getsearWord();
           this.info.type =  this.info.searchWord.type;
        //    this.info.type = 'leave';
           switch(this.info.type){
            case 'leave': //请假申请单
                this.info.listConfig =this.config[0];
                this.getData('fzmjxy_select_sys_dic',{type:7},this.info.type)
                break;
            case 'missed': //漏打卡申请单
                this.info.listConfig =this.config[1];
                this.getData('fzmjxy_select_sys_dic',{type:12},this.info.type)
                break;
            case 'goOut': //外出申请单
                this.info.listConfig =this.config[2];
                this.getData('fzmjxy_select_sys_dic',{type:10},this.info.type)
                break;
        }  
    } 
    componentDidMount = () => { 
    } 

    getsearWord =() => {
            let  url = location.hash.replace("#/ApplicationForm",""); //获取url中"?"符后的字串
            let  theRequest = new Object();
            if (url.indexOf("?") != -1) {
                let  str = url.substr(1);
                let strs = str.split("&");
                for (let  i = 0; i < strs.length; i++) {
                    theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
                }
            }
            return theRequest;
    }
    // 数据请求
    getData = (key,par,type) =>{ 
        let that =this;
        T.ajax({
        key: key,
        data: par,
        success: function success(result) {
               let results = typeof(result)=='string'? JSON.parse(result):result;
               let data = results.data?results.data:[];//可能是错误的
               that.proDataFn(data,type); 
            }
        });
    }
     proDataFn=(result,type)=>{
         switch(type){
             case "leave":
                         this.info.listConfig.data.map((item,i) => {
                            if(item.type =='btn'){
                                item.data=[]; 
                                result.map((jtem,j)=>{
                                    if(jtem.text.includes('事') || jtem.text.includes('病') || jtem.text.includes('婚') || jtem.text.includes('丧')){
                                         item.data.push(jtem)
                                    }
                                }) 
                                 item.currentLev =item.data[0].text;
                                
                            }
                        })
             break;
             default:
                      this.info.listConfig.data.map((item,i) => {
                        if(item.type =='btn'){
                            item.data=[]; 
                            item.data =result
                            item.currentLev = item.data.length>0 ? item.data[0].text:'';
                            item.currentIndex = item.data.length>0 ? item.data[0].value:''
                                            
                        }
                    })
             break;
         }   

         this.setState({})
     }

    submitFn = (e) => {// 提交  
        let  phone=this.info.searchWord.phone;
        // let  phone='15859199366';
         
        let data = this.info.listConfig.data;   
        switch(this.info.type){
          case 'leave': //请假申请单
            let par_leave={
                phone:phone,
                type:data[1].currentIndex,
                btime:this.refs.listdeal.condition.bTime,
                etime:this.refs.listdeal.condition.eTime,
                reason:data[2].content, 
            } 
            this.postData("fzmjxy_insert_daily_leave",par_leave,this.info.type) 
            break;
          case 'missed': //漏打卡申请单 
              let par_missed = {
                phone:phone,
                untm:this.refs.listdeal.condition.bTime,
                type:data[1].currentIndex,
                remark:data[2].content,   
                aid:''
            }  
             if(this.refs.listdeal.fileData.length>0){
                this.filesUp(par_missed,this.info.type); //附件上传 获取id  
            }else{
                this.postData("fzmjxy_insert_daily_unclock",par_missed,this.info.type)  
            }
            break;
         case 'goOut': //外出申请单  
            let par_goOut = { 
                phone:phone,
                btime:this.refs.listdeal.condition.bTime,
                etime: this.refs.listdeal.condition.eTime,
                addr:data[1].content, 
                type:data[2].currentIndex,
                theme:data[3].content,
                zzf:data[4].content,
                js:data[5].content,  
                remark:data[7].content,  
                aid:''
            }
             if(this.refs.listdeal.fileData.length>0){
                this.filesUp(par_goOut,this.info.type); //附件上传 获取id  
            }else{
                this.postData("fzmjxy_insert_daily_out",par_goOut,this.info.type)  
            }
            break;
      }
    }

    postData = (key,par,type) =>{ //提交
        let that =this;
        T.ajax({
        key: key,
        method:'POST',
        data: par,
        success: function success(result) {
            that.setState({loading : false})
            console.log(result)
              let  phone=that.info.searchWord.phone;
             window.location.href =  '/WebMobile/app/kq.html#/kq?index=1&username='+phone 
            //    let data = typeof(result)=='string'? JSON.parse(result).data:result.data;
            //    that.proDataFn(data,type); 
            }
        });
    }

  filesUp = (par,type) =>{
        let formData = new FormData();  
            formData.append("DataType", "UploadFile");
            formData.append("UploadFolder", "/CommonReport/");
            formData.append("IsConvertOffice", "");
            formData.append("GetFileName", "y");
            formData.append("TCID", "");
            formData.append("UploadTargetKey", "n");
            formData.append("GetFileInfo", "y");  

            this.refs.listdeal.fileData.map((item,i) => {
                    let info = item.file; 
                    formData.append('files',info)
            }) 
            this.setState({loading : true}) 
          T.ajax({//上传文件
            f : 'json',
            key : 'FileUpPath',
            data:formData,
            method:'POST',
            contentType: !1,
            // contentType: false,
            success : (result) => {
                 let results = typeof(result)=='string'? JSON.parse(result):result;
                 results.map((item,i) => {
                     this.info.fileId.push(item.id)
                }); 
                par.aid = this.info.fileId.toString();
                let url = type=='goOut' ? 'fzmjxy_insert_daily_out' : 'fzmjxy_insert_daily_unclock';
                this.postData(url,par,this.info.type)  
            }
        }); 
        
  }

    resetFn = (e) =>{// 重置 
         this.info.listConfig.data.map((item,i) => {
            switch(item.type){
                case 'time': 
                    item.tms = ''
                    this.refs.listdeal.condition.bTime=  T.clock(new Date()).fmt('YYYY-MM-DD')+ ' 08:00';
                    this.refs.listdeal.condition.eTime =  this.condition.bTime; 
                    break;
                case 'btn': 
                    item.currentLev = item.data[0].text;
                    item.currentIndex = item.data[0].value;
                    break;
                case 'input': 
                    item.content = ""
                    break;
                case 'file':  
                    this.refs.listdeal.fileData =[]
                    this.refs.listdeal.fileindex =0;
                    // this.refs.listdeal.refs.filelists.removeChild ;
                    let fileslist = this.refs.listdeal.refs.filelists;
                    while(fileslist.hasChildNodes()) 
                    {
                        fileslist.removeChild(fileslist.firstChild);
                    }

                    break;
            }
         })
         this.setState()
    }
    cancalFn = (e) =>{// 取消 
             let  phone=this.info.searchWord.phone;
        window.location.href =  '/WebMobile/app/kq.html#/kq?index=1&username='+phone 
    }

    render() {
        return (
            <div  className="ApplicationForm">
                <div className="headtitle"> {this.info.listConfig.title} </div>
                <ListDeal  listConfig={this.info.listConfig}  ref='listdeal'></ListDeal> 
                <Spinner  show={this.state.loading}  text="保存中..."></Spinner>
                <div className="footWrap">
                     <Btn type='primary' onChange={this.submitFn} >提交</Btn>
                    <Btn type='simple' onChange={this.resetFn} >重置</Btn>
                    <Btn type='simple' onChange={this.cancalFn} >取消</Btn>
                </div> 
             </div>
        )
    }
} 
export default ApplicationForm 